<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="css/login.css">
    <title>登录</title>
</head>
<body>
   <!-- 头部 -->
   <header>
    <div class="center">
        <ul>
            <li><a href="#">康佳新闻</a></li>
            <li></li>
            <li><a href="#">加入康佳</a></li>
            <li></li>
            <li><a href="#">校园招聘</a></li>
            <li></li>
            <li><a href="#">康佳社区</a></li>
            <li></li>
            <li><a href="#">大宗采购</a></li>
            <li></li>
            <li><a href="#">积分商城</a></li>
            <li></li>
        </ul>
        <ul class="ul">
            <li><a href="login.html">登录</a></li>
            <li class="li"></li>
            <li><a href="register.html">注册</a></li>
            <div><a href="#" class="buya">购物车(0)</a></div>
        </ul>

    </div>

</header>
<!-- 导航栏 -->
<div class="kong">
    <div class="center">
        <nav>
            <div class="logo"><a href="index.html"><img src="image/login.png" alt=""></a></div>
            <ul>
                <li class="nav-list"><a href="#">首页</a></li>
                <li class="nav-list"><a href="#">电视
                    </a>
                    <div class="item">
                        <ul>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>
                            <li><a href="#"><img src="image/2-1.jpg" alt=""></a>
                                <h4>阿斐亚A3</h4>
                                <div class="item-text">洞见未来 / 帧享视界</div>
                                <p>￥11999.00</p>
                            </li>

                        </ul>
                    </div>
                </li>
                <li class="nav-list"><a href="#">冰箱</a></li>
                <li class="nav-list"><a href="#">洗衣机</a></li>
                <li class="nav-list"><a href="#">生活电器</a></li>
                <li class="nav-list"><a href="#">厨房电器</a></li>
                <li class="nav-list"><a href="#">智能周边</a></li>
                <li class="nav-list"><a href="#">K迷优品</a></li>
                <li class="nav-list"><a href="#">大宗采购</a></li>
                <li class="nav-list"><a href="#">服务</a></li>
                <li><a href="#"></a></li>
            </ul>
        </nav>
    </div>

</div>

    <div class="login">
       
       <div class="center">
           <div class="login-form">
               <div class="login-heading">
                   <p>会员登录</p>
                   <a href="#">立即注册成为会员>></a>
               </div>
               <form class="form-horizontal">
                <div class="form-group">
                  <label for="username" class="col-sm-2 control-label">账号</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" name="username" placeholder="手机号/邮箱/用户名">
                  </div>
                </div>
                <div class="form-group">
                  <label for="password" class="col-sm-2 control-label">密码</label>
                  <div class="col-sm-10">
                    <input type="password" class="form-control" name="password" placeholder="登录密码">
                  </div>
                </div>
                <div class="form-group">
                    <label for="inputyanzheng" class="col-sm-2 control-label">验证码</label>
                    <div class="col-sm-10 yanzheng-flex">
                      <input type="text" class="form-control  yanzheng" id="inputyanzheng" placeholder="验证码">
                      <div class="col-md-5 yanzheng-icon">
                        <span id="vcd">166228</span>
                        <button type="button" class="btn btn-link btn-sm"  >更换验证码</button>
                    </div>
                    </div>
                  </div>
                <div class="form-group">
                  <div class="col-sm-offset-2 col-sm-10 mi">
                    <div class="checkbox">
                      <label>
                        <input type="checkbox"> 自动登录
                      </label>
                    </div>
                    <a href="#">忘记密码？</a>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">登录</button>
                  </div>
                </div>
              </form>
           </div>
     
         </div> 
    </div>

    
   <!-- 底部 -->
   <div class="footer">
    <div class="center">
        <div class="footer-top">
            <ul>
                <li><img src="image/包邮.png" alt="">
                 <div class="foo-title">
                     <h4>全场包邮</h4>
                     <small>全场商品免费送到家</small>
                 </div>
             </li>
             <li><img src="image/包邮.png" alt="">
                 <div class="foo-title">
                     <h4>全场包邮</h4>
                     <small>全场商品免费送到家</small>
                 </div>
             </li>
             <li><img src="image/包邮.png" alt="">
                 <div class="foo-title">
                     <h4>全场包邮</h4>
                     <small>全场商品免费送到家</small>
                 </div>
             </li>
             <li><img src="image/包邮.png" alt="">
                 <div class="foo-title">
                     <h4>全场包邮</h4>
                     <small>全场商品免费送到家</small>
                 </div>
             </li>
               
            </ul>
        </div>
        <div class="footer-links">
            <dl>
                <dt>帮助中心</dt>
                <dd><a href="#">购买指南</a></dd>
                <dd><a href="#">支付方式</a></dd>
                <dd><a href="#">配送方式</a></dd>
                <dd><a href="#">售后政策</a></dd>
                <dd><a href="#">防伪查询</a></dd>
             
               
            </dl>
            <dl>
             <dt>新闻中心</dt>
             <dd><a href="#">集团新闻</a></dd>
             <dd><a href="#">媒体报道</a></dd>
            
         </dl>
         <dl>
             <dt>投资者关系</dt>
             <dd><a href="#">公司概要</a></dd>
             <dd><a href="#">高管团队</a></dd>
             <dd><a href="#">最新公告</a></dd>
             <dd><a href="#">公司治理</a></dd>
            
         </dl>
         <dl>
             <dt>集团成员网站</dt>
             <dd><a href="#">华侨城集团</a></dd>
             <dd><a href="#">康佳全球服务中心</a></dd>
             <dd><a href="#">康佳国际营销</a></dd>
             <dd><a href="#">康佳移动互联科技</a></dd>
             <dd><a href="#">康佳壹视界商业显示</a></dd>
             <dd><a href="#">康佳智能电器</a></dd>
            
         </dl>
         <dl>
             <dt>关于我们</dt>
             <dd><a href="#">了解康佳</a></dd>
             <dd><a href="#">加入康佳</a></dd>
             <dd><a href="#">校园招聘</a></dd>
             <dd><a href="#">联系我们</a></dd>
            
         </dl>
         <dl>
             <dt>关注我们</dt>
             <dd><a href="#">官方微博</a></dd>
             <dd><a href="#">官方微信</a></dd>
             <dd><a href="#">官方社区</a></dd>
             <dd><a href="#">K迷俱乐部</a></dd>
             <dd><a href="#">康佳微商城</a></dd>
             <dd><a href="#">康佳服务</a></dd>
             <dd><a href="#">腾讯视频TV端</a></dd>
            
         </dl>
         <div class="links-phone">
             <p class="hotlink">24小时全国服务热线</p>
             <p class="tele">400-880-0016</p>
             <a href="#" class="zhixun">购买咨询</a>
             <a href="#" class="shouhou">售后服务</a>
         </div>
        </div>
    </div>
</div>
     <footer>
         <div class="center">
             <img src="image/kangjia.png" alt="">
             <p>Copyright c 1980-2021康佳集团股份有限公司版权所有</p>
             <span>|</span>
             <a href="#">联系我们</a>
             <span>|</span>
             <a href="#">法律声明</a>
             <span>|</span>
             <a href="#">隐私保护</a>
             <span>|</span>
             <a href="#">快递查询</a>
             <span>|</span>
             <a href="#">腾讯视频TV端</a>
             <span>|</span>
             <a href="#">粤ICP备05059413号</a>
         </div>
         <div class="footer-copy">
             <img src="image/s.png" alt="">
             <img src="image/s1.png" alt="">
             <img src="image/s2.gif" alt="">
         </div>
     </footer>    
    <script src="js/jquery.js"></script>
    <script src="js/login.js"></script>
    <script src="js/list.js"></script>
     <script src="js/ajax_promise.js"></script>
  
   <script>
    const form = document.querySelector('.form-horizontal')
    document.querySelector('.btn-default').onclick = function (e) {
        e.preventDefault();
        const username = form.username.value
        const password = form.password.value
        ajax({
            type: 'post',
            url: './php/login.php',
            data: {
                username,
                password
            }
        }).then(res => {
            console.log(res)
            const obj = JSON.parse(res)
            console.log(obj)
            if (obj.code == 0) {
                //登录失败
                alert(obj.msg)
            } else {
                //登录成功  返回token，存在cookie里面
               setCookie('token',obj.token,10000000000)
            
            location.href='index.html'
            }
        })
    }

    function setCookie (key, value, expires) {
const time = new Date()
time.setTime(time.getTime() - 1000 * 60 * 60 * 24 * 8 + expires) // 用于设置过期时间
document.cookie = `${key}=${value};expires=${time};`
}
</script>
</body>
</html>